<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!-- Custom styles for this template -->
    <link href="css/dashboard.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.10/examples/dashboard/dashboard.css" rel="stylesheet">

</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container-fluid">

        <div class="row">
            <div class="col-sm-3 col-md-2 sidebar">
                <ul class="nav nav-sidebar">
                    <li class="active"><a href="#">首页</a></li>
                    <li><a href="javascript:void(0);" class="menu">商品类别管理</a></li>
                    <li><a href="javascript:void(0);" class="menu">商品管理</a></li>
                    <li><a href="javascript:void(0);" class="menu">订单管理</a></li>
                    <li><a href="javascript:void(0);" class="menu">物流合作管理</a></li>
                    <li><a href="javascript:void(0);" class="menu">公告管理</a></li>

                </ul>

            </div>

            <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
                <h1 class="page-header" id="title">首页</h1>
                <iframe id="target" scrolling="no" width="100%" height="100%" frameborder="0" src=""></iframe>
            </div>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#">Dashboard</a></li>
                <li><a href="#">Settings</a></li>
                <li><a href="#">Profile</a></li>
                <li><a href="#">Help</a></li>
            </ul>
            <form class="navbar-form navbar-right">
                <input type="text" class="form-control" placeholder="Search...">
            </form>
        </div>
    </div>

</nav>


<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>

<script type="text/javascript">
    $(function () {
        //为按钮绑定事件
        $(".menu").click(function () {
            var url = $(this).attr("url");
            var title = $(this).text();
        //给我们的目标窗口赋值
            $("#target").attr("src",url);
            $("#target").height($(window).height());
            $("#title").html(title);
        })

        $("#save").click(function () {
            $("#add-form").submit();
        })
    })
</script>

</body>
</html>